<!--  -->
<template>

	<div class="bg_fff login_module4">
     <xl-header :isBack="true">
     登录
    </xl-header>


		<div class="mui-content login">
			<div class="login_top">
				<img src="../assets/images/theme.png">
			</div>
			<div class="login_main">
				<div class="login_box">
					<input type="text" v-model="username" placeholder="请输入手机号" />
				</div>
				<div class="login_box">
					<input type="password" v-model="password" placeholder="请输入密码(6~12位)" />
				</div>
			</div>
			<input type="button" value="登录" class="login_btn" @click="login" />
			<ul class="login_max">
				<li class="act " @click="$router.push('/reg')">
					注册账号
				</li>
				<li>
					忘记密码
				</li>

			</ul>

		</div>
	</div>
 
</template>

<script>
export default {
  data() {
    return {
        username:'',
	    password:''

	};
  },
  mounted() {},
  methods: {
      
	  login(){
		  let {username,password} = this;
	
          //  校验数据

		  if(!username){
			  alert('请填写用户名')
			  return 
		  }

      if(!/^\w{6,12}$/.test(username)){

			   alert('用户名为6-12位的数字或者字母')
			   return 
		   }

		  if(!password){
			  alert('请填写密码')
			  return 
		  }

		  
       if(!/^\w{6,12}$/.test(password)){

			   alert('密码为6-12位的数字或者字母')
			   return 
		   }
           
		   //  数据发给服务器

		   this.$http.post('/api/login',{
			   password,
			   username
		   })
		   .then(res=>{
			   console.log(res)
             //   一般是用code码来判断的   这个的后端没写好  

				if(res.uid){
                     alert(res.msg)
                     ///  
					 localStorage.setItem('username',res.username); // 存一个叫username的数据   res.username

					 localStorage.setItem('uid',res.uid)

					 //  返回上个页面  不要用push  2222222222222222222

					 this.$router.back()


				}else{

					 alert(res.msg)
				}

		   })
		   .catch(err=>{
			   console.log(err)
		   })





	  }


  },
};

</script>
<style lang='scss'>


@import url(../assets/css/login.css);
 
</style>